<form class="layui-form layui-card" data-table-id="MenuTable" action="{:sysuri()}" data-auto="true" onSubmit="return false" method="post">

    <div class="layui-card-body">

       

        <div class="layui-form-item">
            <label class="layui-form-label"><span class="color-red">*</span>任务名称</label>
            <div class="layui-input-block">
                <input name="name" value='{$vo.name|default=""}'  lay-verify="required" placeholder="请输入任务名称" class="layui-input">
            </div>
        </div>


    

        <div class="layui-form-item">
            <label class="layui-form-label"><span class="color-red">*</span>班级</label>
            <div class="layui-input-block">
                <select class="layui-select"   lay-verify="required"  lay-filter="classSelect" name="parent_id" lay-search>
                    {volist name="class_list" id="class"} 
                        <option value="">- 选择班级 -</option>
                        <option value="{$class.id}" {if isset($vo.parent_id) && $vo.parent_id == $class.id} selected {/if}>{$class.name}</option>
                    {/volist}
                </select>
            </div>
        </div>


        <div class="layui-form-item">
            <label class="layui-form-label"><span class="color-red">*</span>类型</label>
            <div class="layui-input-block">
                <select class="layui-select"  lay-filter="typeSelect" name="type">
                    <option value="">- 选择类型 -</option>
                    <option value="2" {if isset($vo.type) && $vo.type == 2} selected {/if}>视频课程</option>
                    <option value="3" {if isset($vo.type) && $vo.type == 3} selected {/if}>题库</option>
                </select>
            </div>
        </div>


        <div class="layui-form-item   {if !isset($vo.type) || $vo.type != 2} layui-hide {/if}  " id="video_list_show">
            <label class="layui-form-label">关联视频</label>
            <div class="layui-input-block">
                <select class="layui-select" required  id="video_list" name="video_id" lay-search>
                    {if isset($video_list) && count($video_list)}
                        <option value="">- 选择视频 -</option>
                        {volist name="video_list" id="video"} 
                            <option value="{$video.id}" {if isset($vo.rel_id) && $vo.rel_id == $video.id} selected {/if}>{$video.name}</option>
                        {/volist}
                    {/if}
                </select>
            </div>
        </div>

        <div class="layui-form-item  {if !isset($vo.type) || $vo.type != 3} layui-hide {/if} " id="exam_list_show">
            <label class="layui-form-label">关联题库</label>
            <div class="layui-input-block">
                <select class="layui-select" required  id="exam_list" name="exam_id" lay-search>
                    {if isset($exam_list) && count($exam_list)}
                        <option value="">- 选择题库 -</option>
                        {volist name="exam_list" id="exam"} 
                            <option value="{$exam.id}" {if isset($vo.rel_id) && $vo.rel_id == $exam.id} selected {/if}>{$exam.name}</option>
                        {/volist}
                    {/if}
                   
                </select>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label"><span class="color-red">*</span>打卡日期</label>
            <div class="layui-input-block">
                <input name="task_date" value='{$vo.task_date|default=""}'  id="task_date" lay-verify="required" placeholder="请输入打卡日期" class="layui-input">
            </div>
        </div>

     
            
  

        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">任务描述</label>
            <div class="layui-input-block">
              <textarea placeholder="请输入任务描述" name="description" class="layui-textarea">{$vo.description|default=''}</textarea>
            </div>
        </div>



    </div>

    <div class="hr-line-dashed"></div>
    {notempty name='vo.id'}<input type='hidden' value='{$vo.id}' name='id'>{/notempty}

    <div class="layui-form-item text-center">
        <button class="layui-btn" lay-submit type='submit'>保存数据</button>
        <button class="layui-btn layui-btn-danger" type='button' data-confirm="确定要取消编辑吗？" data-close>取消编辑</button>
    </div>
</form>

{block name='script'}
<script>
    layui.use(['form', 'laydate'], function(){
        var form = layui.form;
        var laydate = layui.laydate;
        var $ = layui.$;
        laydate.render({
            elem: '#task_date',
            trigger: "click"
        });
            // 监听班级选择
        form.on('select(classSelect)', function(data){
            var classId = data.value;
            $('#users').html('<option value="">加载中...</option>');
            form.render('select');

            if (classId) {
                $.post("{:url('content/class_task/sys_get_list')}", {class_id: classId}, function(res){
                    if (res.code == 1) {
                        var video_list  = res.data.video_list;
                        var exam_list  = res.data.exam_list;
                        if(video_list.length > 0){
                            var html = '<option value="">- 选择视频 -</option>';
                            video_list.forEach(function(item){
                                html += '<option value="' + item.id + '">' + item.name + '</option>';
                            });
                            $('#video_list').html(html);
                        }
                        if(exam_list.length > 0){
                            var html = '<option value="">- 选择题库 -</option>';
                            exam_list.forEach(function(item){
                                html += '<option value="' + item.id + '">' + item.name + '</option>';
                            });
                            $('#exam_list').html(html);
                        }
                        // var html = '<option value="">- 请选择学员-</option>';
                        // res.data.forEach(function(item){
                        //     html += '<option value="' + item.id + '">' + item.full_name + '</option>';
                        // });
                        // $('#users').html(html);
                    } else {
                        layer.msg(res.info || '学员加载失败');
                    }
                    form.render('select');
                });
            }
        });


        form.on('select(typeSelect)', function(data){
            var type = data.value;
            $('#video_list_show').addClass('layui-hide');
            $('#exam_list_show').addClass('layui-hide');
            if(type == 2){
                $('#video_list_show').removeClass('layui-hide');
            }else if(type == 3){
                $('#exam_list_show').removeClass('layui-hide');
            }
        });

        
    });


</script>
{/block}
